<template>
	<view>
	<!-- 404页面 -->
        <view class="noData" v-if="netWorkType == 'none'"><noData @handle="refresh"></noData></view>
        <view v-if="netWorkType != 'none'">
			
		
		<view class="user_list">
			<view  class="list_sub" @tap="jumpPath('','nickname')">			
					<text>用户信息</text>
					<!-- <text v-if="data.list.realname" class="list_sub_icon">{{data.list.realname}}</text>	
					<text v-else class="list_sub_icon">未认证</text> -->
					<view class="right-box">
					<view class="face">
						<image  :src="data.list.avatar" ></image>
					</view>
					<text  class="list_sub_icon">{{data.list.nickname}}</text> 
					<text class="iconfont" style="padding-left: 30rpx;">&#xe620;</text>
					</view>
			</view>
			<!-- <view class="list_sub">
				<navigator url="../security_openaccount/security_openaccount">
					<text>开户</text>
					<text class="list_sub_icon">未开户<i class="fa fa-angle-right"></i></text>
				</navigator>	
			</view> -->
			<!-- <view class="list_sub">
				<text>VIP认证</text>
				<text class="list_sub_icon">未认证<i class="fa fa-angle-right"></i></text>	
			</view> -->
			<!-- <view class="list_sub">
				<text>我的银行卡</text>
				<view @tap="jumpPath('../security_bank/security_bank','bank')" class="bankstyle">
					<text class="bankname">{{data.list.bank_type}}</text>
					<text class="bankname">{{data.list.bank}}</text>			
					<i class="icon_angle fa fa-angle-right"></i>
				</view>
				<text @tap="jumpPath('../security_bank/security_bank','bank')" v-if="data.list.bank==''" class="list_sub_icon">未绑定</text>
			</view> -->
			<view class="list_sub" @tap="setPwd">
				<text>交易密码</text>
				
					<text class="list_sub_icon">
						修改
						<!-- <navigator url="../security_password/security_password">	
						    修改<i class="fa fa-angle-right"></i>
						</navigator> -->
					</text>	
				
			</view>
		</view>
		<!--  -->
		<!--  -->
		<view class="user_list">
			<view @tap="jumpPath('/pages/my/phone/phone_binding','mobile')" class="list_sub">
					<text>我的手机号</text>
					<text class="list_sub_icon">{{data.list.mobile?data.list.mobile:'未绑定'}}
					<i class="fa fa-angle-right"></i>
					<text class="iconfont" style="padding-left: 30rpx;">&#xe620;</text></text>		
					
			</view>
			<view @tap="jumpPath('/packageInvite/pages/cert/index','apply_status')" class="list_sub">
					<text>入驻信息</text>
					<text class="list_sub_icon">{{data.list.mobile?data.list.mobile:'未绑定'}}
					<i class="fa fa-angle-right"></i>
					<text class="iconfont" style="padding-left: 30rpx;">&#xe620;</text></text>		
					
			</view>

			
			<view @tap="jumpPath('/packageUser/pages/my/invoice/index','bill')" class="list_sub">
					<text>发票</text>
					<text class="list_sub_icon">修改
					<i class="fa fa-angle-right"></i>
					<text class="iconfont" style="padding-left: 30rpx;">&#xe620;</text></text>		
					
			</view>
		</view>
		<!--  -->
		<!--  -->
		<view class="user_list">
			<view class="list_sub">
				<view @tap="jumpPath('/packageUser/pages/user/security_password/security_password','password')" style="display: flex;justify-content: space-between;width: 100%;">
					<text>登录密码</text>
					<text class="list_sub_icon">
						修改<i class="fa fa-angle-right"></i>
						<text class="iconfont" style="padding-left: 30rpx;">&#xe620;</text>
					</text>	
				</view>
			</view>
			<view @tap="jumpPath('/packageUser/pages/user/security_email/security_email','email')" class="list_sub">			
					<text>个人邮箱绑定</text>
					<text class="list_sub_icon">{{data.list.email?data.list.email:'未绑定'}}
					<i class="fa fa-angle-right"></i>
					<text class="iconfont" style="padding-left: 30rpx;">&#xe620;</text></text>						   
			</view>
			<!-- <view class="list_sub">
				<text>交易密码</text>
				<text class="list_sub_icon">修改<i class="fa fa-angle-right"></i></text>	
			</view> -->
		</view>
		<!--  -->
		<!-- <tui-button type="theme" shape="circle"  @tap="bindLogout">安全退出</tui-button> -->
			
			
		</view>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	// import tuiButton from "@/components/button/button"
	import { mapGetters } from 'vuex';
	export default {
		components:{
			// tuiButton
			uniPopup
		},
		data() {
			return {
				data:{
					list:""
				},
				hasLogin:false,
				code_len: 6, // 验证码长度
				code_val: '', // 验证码的值
				is_focus: false
			};
		},
		computed: {
            ...mapGetters(['netWorkType'])    
        },
		onShow:function() {
			let _this=this;
			// let service = _this.$service
			var opt={
					url:'/user/index',
					data:{
										
					},
					success:function(res){
								
						if(res.status==1){   			  				 
							_this.data.list = res.data.list																						
						}else{
								uni.showToast({
									icon:'none',
									title:res.message
								});
						}
					}
			};
			
			_this.$service.GetApi(opt); 
		},
		methods:{
			// 刷新的方法
			refresh(){
			   window.addEventListener('pageshow', this.onShow);     
			},
			// 跳转公共方法
			navClick(url){
				this.$refer.setVilit(url)
				this.$refer.toUrl()
			},
			// 单独一个页面去进行验证和修改
			setPwd(){
				const _this = this
				
				_this.$refer.setVilit('/pages/Setting/SettingPayPassword/PayPassword')
				let callback = function(url) {
					_this.$refs.popupvLogin.open()
				}
				_this.$refer.toUrl(callback)
				
			},
			setCode(e) {
				this.code_val = e.detail.value;
			},
			onCode() {			
				this.is_focus = true;
			},
			blurCode() {
				this.is_focus = false;
			},
			
			jumpPath(path,opt){
				var _this = this
				// uni.showToast({
				// 	icon:'none',
				// 	title:'开发中'
				// })
				// return ;
				console.log('点击有值')
				//实名
				if(opt=='realName')
				{
					_this.$refer.setVilit(path)
					let callback = function(url){
					   _this.$refs.popupvLogin.open()
					}
					_this.$refer.toUrl(callback)
					return
				}
				else if(opt=='bill'){
					// uni.showToast({
					// 	icon:'none',
					// 	title:'开发中'  
					// 发票
					_this.$refer.setVilit(path)
					
					let callback = function(url){
					   _this.$refs.popupvLogin.open()
					}
					_this.$refer.toUrl(callback)
					return
				}
				//手机
				else if(opt=='mobile')
				{
					console.log('有值')
					// this.$refer.setVilit('/page/user/security/phone/phone_binding')
					// this.$refer.toUrl()
					if(_this.data.list.mobile){
						_this.$refer.setVilit('/pages/my/phone/phone_verification')
					}else{
						_this.$refer.setVilit(path)
					}
					
					
					let callback = function(url){
					   _this.$refs.popupvLogin.open()
					}
					_this.$refer.toUrl(callback)
					return
				}
				//银行卡
				
				else if(opt=='bank'&&_this.data.list.bank)
				{
					_this.$refer.setVilit(path)
					let callback = function(url){
					   _this.$refs.popupvLogin.open()
					}
					_this.$refer.toUrl(callback)
					return
				}
				
				//邮箱
				else if(opt=='email'&&_this.data.list.email)
				{
					_this.$refer.setVilit(path)
					let callback = function(url){
					   _this.$refs.popupvLogin.open()
					}
					_this.$refer.toUrl(callback)
					return
				}
				else{
					// uni.navigateTo({
					// 	url:path
					// });
					_this.$refer.setVilit(path)
					let callback = function(url){
					   _this.$refs.popupvLogin.open()
					}
					_this.$refer.toUrl(callback)
				}
				
			},
			bindLogout() {
				
				let _this=this;
				var opt={
					url:'/user/logout',
					success:function(res){
						//
						console.log(res)
						
						if(res.status==1){
							console.log(res.message);
							uni.setStorageSync('token','');
							uni.setStorageSync('userInfo','');
							uni.setStorageSync('hasLogin',false);
							uni.showToast({
								icon:'none',
								title:'安全退出',
								duration: 3000,
								success() {
									// uni.reLaunch({
									// 	url:'/pages/loginer/login/login'
									// });
									_this.$refer.setVilit('/pages/loginer/login/login')
									let callback = function(url){
									   _this.$refs.popupvLogin.open()
									}
									_this.$refer.toUrl(callback,'','reLaunch')
								}
								
							});
							
							
						}else{
							uni.showToast({
								icon:'none',
								title:res.message
							});
						}
					}
				};
				_this.$service.GetApi(opt);
			   
			}
		}
	}
</script>
<style scoped lang="scss">
	@import 'Setting.scss';
</style>
<style>
	page{
		background: #f2f2f2;
	}
	uni-button{
		width: 80%;
		margin-bottom: 60upx;
		background: #be2120;
	}
	.right-box{
		display: flex;
		align-items: center;
		/* padding-right: 20rpx; */
	}
	.face{
		/* position: absolute; */
		/* right: 80upx; */
		/* top:10upx; */
		width: 50upx;
		height: 50upx;
		flex-shrink: 0;
		/* // margin-right: 20upx; */
		border-radius: 100%;
		overflow: hidden;
	}
	.face image{
		width: 100%;
		height: 100%;
		border-radius: 100%;
		display: block;
		
	}
	.user_list{
		width: 100%;
		font-size: 32upx;
		margin-bottom: 20upx;
	}
	.list_sub{
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		padding: 0upx 40upx;
		background: #f3f3f3;
		position: relative;
		height: 100upx;
		line-height: 100upx;
		border-bottom: 1px #ededed dashed;
		background: #fff;
		
	}
	.list_sub:first-child{
		border-top: 1px #ddd solid;
	}
	
	.list_sub_icon{
		/* position: absolute; */
		/* right: 20upx; */
		font-size: 28upx;
		
	}
	.list_sub_icon i{
		margin-left: 20upx;
	}
	.bankname{
		font-size: 28upx;
	}
	.bankstyle{
		font-size: 26upx;
		position: absolute;
		right: 20upx;
		top: 10upx;
		color: #666666;
	}
	.bankstyle text{
		display: block;
		line-height: 40upx;
		margin-right: 60upx;
	}
	.icon_angle{
		position: absolute;
		right: 0upx;
		top: 20upx;
		font-size: 32upx;
		color: #000;
		
	}
</style>
